<template>
	<view class="reply">
		<u-popup :show="show" @close="show = false" round="12" :safe-area-inset-bottom="false" zIndex="10099">
			<view class="ph-32 pv-32" style="padding-bottom: 30rpx;">
				<view class="input h-72 b-72 ph-28 f ai-c u-flex-y-center">
					<input fontSize="12" cursor-spacing="14" class="inp" v-model="commentContent" :focus="show"
						:placeholder="placeholder" @confirm="commentSubmit"/>
					<view class="send" @click="commentSubmit">发送</view>
				</view>
			</view>
		</u-popup>
	</view>
</template>
<script setup lang="ts">
	import { ref } from 'vue';
	import { commentCreate,commentCreateReply } from '@/services/api/novice';
	import { useAuthStore } from '@/store/modules/auth';
	const show = ref(false);
	const id = ref();
	const parentId = ref();
	const commentContent = ref<string>();
	const placeholder = ref<string>();
	const emit = defineEmits(['upDate']);
	const authStore = useAuthStore();
	const city=ref('')
	getCity()
	function getCity() {
			uni.getLocation({
				type: 'wgs84',
				geocode: true,
				success: function (res) {
					console.log(res);
					console.log('当前位置的纬度：' + res.latitude);
					let location = res.latitude + ',' + res.longitude;
					uni.request({
						url: 'https://apis.map.qq.com/ws/geocoder/v1/?location=location',
						data: {
							location: location,
							key: 'X3HBZ-6K2CX-JRP4Z-ZH4VQ-K2YNZ-IMFFD', //自己申请的Key
						},
						method: 'GET',
						success(res) {
							city.value = res.data.result.address_component.city
						},
					});
				},
				fail: function (res) {
					console.log(res);
				},
			});
		}
	//提交评论
	async function commentSubmit() {
		if (!commentContent.value) {
			uni.showToast({
				title: '请输入内容',
				icon: 'none',
			});
			return;
		}
		let data = {
			contentId: id.value, 
			commentContent: commentContent.value, 
			city: city.value, 
			
		}
		if(parentId.value>0){
			data.parentId= parentId.value
			await commentCreateReply(data);
		}else{
			await commentCreate(data);
		}
		
		uni.showToast({
			title: '发布成功',
		});
		commentContent.value = '';
		show.value = false;
		emit('upDate');
	}
	const getShow = (data : number, placeholderData : string, data2 : number) => {
		placeholder.value = placeholderData;
		id.value = data;
		parentId.value = data2;
		show.value = true;
	};
	const closeS=()=>{
		show.value = false;
	}
	defineExpose({
		getShow,closeS
	});
</script>
<style lang="scss" scoped>
	.reply {
		.input {
			background: #f8f8f8;
			border: 1rpx solid #dddddd;
		}
	}

	.inp {
		flex: 1
	}

	.send {
		font-size: 28rpx;
		margin-left: 20rpx;
	}
</style>